<extend name="Public:base"/>

<block name="content">

    <div class="feeldesk-form pd0">

        <div class="form-nav">

            <ul>

                <li><a href="javascript:" class="form-tab active">{:L('NEW_FORM')}</a></li>

                <li><a href="javascript:" class="intro-tab">{:L('SET_INSTRUCT')}</a></li>

            </ul>

        </div>

        <div class="form-content pt100">

            <form action="{:U('DefineForm/edit',['id'=>encrypt($detail['form_id'],'DEFINEFORM'),'type'=>encrypt($type,'DEFINEFORM')])}" class="layui-form" method="post">

                <div class="form-item">

                    <input type="hidden" name="define_form[form_id]" value="{$detail.form_id|encrypt='DEFINEFORM'}"/>

                    <input type="hidden" name="define_form[type]" value="{$type|encrypt='DEFINEFORM'}"/>

                    <div class="layui-form-item">

                        <label class="layui-form-label">{:L('FORM_TYPE')}</label>

                        <div class="layui-input-inline">

                            <select name="define_form[form_type]" disabled>

                                <option value="text" <eq name='detail.form_type' value='text'>selected</eq>>{:L('TEXT')}</option>

                                <option value="textarea" <eq name='detail.form_type' value='textarea'>selected</eq>>{:L('TEXTAREA')}</option>

                                <option value="radio" <eq name='detail.form_type' value='radio'>selected</eq>>{:L('RADIO')}</option>

                                <option value="checkbox" <eq name='detail.form_type' value='checkbox'>selected</eq>>{:L('CHECKBOX')}</option>

                                <option value="select" <eq name='detail.form_type' value='select'>selected</eq>>{:L('SELECT')}</option>

                                <option value="select_text" <eq name='detail.form_type' value='select_text'>selected</eq>>{:L('SELECT_TEXT')}</option>

								<option value="date" <eq name='detail.form_type' value='date'>selected</eq>>{:L('DATETIME')}</option>

                                <option value="region" <eq name='detail.form_type' value='region'>selected</eq>>{:L('AREA_COMPONENTS')}</option>

                                <option value="phone" <eq name='detail.form_type' value='phone'>selected</eq>>{:L('CELL_PHONE')}</option>

                                <option value="email" <eq name='detail.form_type' value='email'>selected</eq>>{:L('MAILBOX')}</option>

                                <option value="number" <eq name='detail.form_type' value='number'>selected</eq>>{:L('DIGITAL')}</option>


                            </select>

                        </div>

                    </div>

                    <in name="detail.form_type" value="radio,checkbox,select,select_text">

                        <div class="layui-form-item">

                            <label class="layui-form-label"><span class="red">*</span> {:l('FORM_OPTION')}</label>

                            <div class="layui-input-inline">

                                <input type="text" name="define_form[form_option]" value="{$detail.form_option}" placeholder={:L('ENTER_OPTION')}" class="layui-input">

                            </div>

                        </div>

                    </in>

                    <div class="layui-form-item">

                        <label class="layui-form-label"><span class="red">*</span> {:l('FIELD_NAME')}</label>

                        <div class="layui-input-inline">

                            <input type="text" name="define_form[form_name]" value="{$detail.form_name}" class="layui-input layui-disabled" readonly  placeholder="{:L('ENTER_FIELD_NAME')}"  />

                        </div>

                    </div>

                    <div class="layui-form-item">

                        <label class="layui-form-label"><span class="red">*</span> {:l('FORM_NAME')}</label>

                        <div class="layui-input-inline">

                            <input type="text" name="define_form[form_description]" value="{$detail.form_description}" class="layui-input" placeholder="{:L('ENTER_FORM_NAME')}" />

                        </div>

                    </div>

                    <eq name="langAuth['en_auth']" value="10">

                        <div class="layui-form-item">

                            <label class="layui-form-label">English name</label>

                            <div class="layui-input-inline">

                                <input type="text" name="define_form[name_en]" value="{$detail.name_en}"  placeholder="Enter English name" class="layui-input">

                            </div>

                        </div>

                    </eq>

                    <eq name="langAuth['jp_auth']" value="10">

                        <div class="layui-form-item">

                            <label class="layui-form-label">日本語名</label>

                            <div class="layui-input-inline">

                                <input type="text" name="define_form[name_jp]" value="{$detail.name_jp}"  placeholder="日本語名を入力してください" class="layui-input">

                            </div>

                        </div>

                    </eq>

                    <div class="layui-form-item">

                        <label class="layui-form-label">{:l('FORM_DESCRIPTION')}</label>

                        <div class="layui-input-inline">

                            <input type="text" name="define_form[form_explain]" value="{$detail.form_explain}" class="layui-input" placeholder="{:l('ENTER_FORM_DESCRIPTION')}" />

                        </div>

                    </div>

                    <div class="layui-form-item">

                        <label class="layui-form-label">{:l('IS_NOT_REQUIRED')}</label>

                        <div class="layui-input-inline">

                            <select name="define_form[is_required]">

                                <option value="0" <eq name='detail.is_required' value='0'>selected="selected"</eq>>{:l('YES')}</option>

                                <option value="1" <eq name='detail.is_required' value='1'>selected="selected"</eq>>{:l('NO')}</option>

                            </select>

                        </div>

                    </div>

					<div class="layui-form-item">

                        <label class="layui-form-label">{:L('WHETHER_TO_PREVENT_WEIGHT')}</label>

                        <div class="layui-input-inline">

                            <select name="define_form[is_unique]">

                                <option value="1" <eq name='detail.is_unique' value='1'>selected="selected"</eq>>{:L('YES')}</option>

                                <option value="0" <eq name='detail.is_unique' value='0'>selected="selected"</eq>>{:L('NO')}</option>

                            </select>

                        </div>

                    </div>

					<div class="layui-form-item">

                        <label class="layui-form-label">{:L('LIST_DISPLAY')}</label>

                        <div class="layui-input-inline">

                            <select name="define_form[show_list]">

                                <option value="1" <eq name='detail.show_list' value='1'>selected="selected"</eq>>{:L('YES')}</option>

                                <option value="0" <eq name='detail.show_list' value='0'>selected="selected"</eq>>{:L('NO')}</option>

                            </select>

                        </div>

                    </div>

                    <div class="layui-form-item">

                        <label class="layui-form-label">{:L('IS_ENABLE')}</label>

                        <div class="layui-input-inline">

                            <select name="define_form[closed]">

                                <option value="0" <eq name='detail.closed' value='0'>selected="selected"</eq>>{:L('ENABLE')}</option>

                                <option value="1" <eq name='detail.closed' value='1'>selected="selected"</eq>>{:L('DISABLE')}</option>

                            </select>

                        </div>

                    </div>

                    <div class="layui-form-item">

                        <label class="layui-form-label mt5">{:L('VIEW_RANGE')}</label>

                        <div class="layui-input-inline" id="form_view_range"></div>

                    </div>

                    <div class="layui-form-item">

                        <label class="layui-form-label mt5">{:L('MODIFY_AUTH')}</label>

                        <div class="layui-input-inline" id="form_edit_auth"></div>

                    </div>

                    <script type="text/javascript">

                        var roleList = {$roleList};

                        var roleSelected = '{$detail.role_id}';

                        var memberList = {$memberList};

                        var memberRole = '{$memberRole}';

                        if(!memberRole)
                        {
                            memberRole = memberList;
                        }
                        else
                        {
                            memberRole = JSON.parse(memberRole);
                        }

                        var memberSelected = '{$detail.member_id}';

                        var is_loaded = 1;

                        layui.config({
                            base : '__PUBLIC__/js/layui/extends/'
                        }).use(['selectM'],function()
                        {
                            var list = layui.selectM(
                            {
                                elem: '#form_edit_auth',
                                tips: '{:L("PLEASE_SELECT")}',
                                data: memberRole,
                                selected: memberSelected.split(','),
                                width:'60%',
                                max:100,
                            });

                            layui.selectM(
                            {
                                elem: '#form_view_range',
                                data: roleList,
                                selected: roleSelected.split(','),
                                tips: '{:L("PLEASE_SELECT")}',
                                width:'60%',
                                max:100,
                                callback:function (values)
                                {
                                    var roles = values;

                                    if(roles && is_loaded != 1)
                                    {
                                        if(roles.length == 0)
                                        {
                                            list.config.data = memberList;
                                            list.render();
                                            list.render();
                                        }
                                        else
                                        {
                                            $.ajax({
                                                url:"{:U('AjaxRequest/getMemberByRole')}",
                                                type:'POST',
                                                async: false,
                                                data:{'role_id':roles},
                                                datatype:'json',
                                                success:function(data)
                                                {
                                                    if(data)
                                                    {
                                                        list.config.data = data.data;
                                                        list.render();
                                                        list.render();
                                                    }
                                                }
                                            });
                                        }
                                    }

                                    is_loaded = 0;
                                }
                            });
                        })

                    </script>

                    <div class="layui-form-item">

                        <label class="layui-form-label">{:L('SORT')}</label>

                        <div class="layui-input-inline">

                            <input type="text" name="define_form[orderby]" id="ticket_form_orderby"  value="{$detail.orderby}" class="layui-input" placeholder="{:l('ENTER_FORM_SORT')}" />

                        </div>

                    </div>

                </div>

                <div class="form-submit">

                    <div class="layui-form-item">

                        <div class="layui-input-inline">

                            <a href="javascript:void(0)" class="layui-btn layui-btn-normal" id="submitForm">{:L('SUBMIT')}</a>

                        </div>

                    </div>

                </div>

            </form>

        </div>

        <div class="form-intro hidden">

            <div class="intro-item">

                <div class="intro-title">{:L('FORM_TYPE_STYLE')} <i class="iconfont icon-xiangxiajiantou fr"></i></div>

                <div class="intro-detail layui-form hidden">

                    <div class="intro-form layui-input-block ml0">

                        <input type="text" class="layui-input form-input" placeholder="{:L('TEXT')}" disabled>

                        <select name="xiala" lay-filter="form_type">

                            <option value="">{:L('SELECT')}</option>

                            <option value="">{:L('OPTION',['format'=>'A'])}</option>

                            <option value="">{:L('OPTION',['format'=>'B'])}</option>

                            <option value="">{:L('OPTION',['format'=>'C'])}</option>

                        </select>

                        <textarea class="layui-textarea" disabled>{:L('TEXTAREA_NOTE')}</textarea>

                        <div class="layui-form-item">

                            <label class="layui-form-label pl0">{:L('RADIO')}</label>

                            <div class="layui-input-block ml0">

                                <input type="radio" name="danxuan" title="{:L('OPTION',['format'=>'A'])}"/>

                                <input type="radio" name="danxuan" title="{:L('OPTION',['format'=>'B'])}"/>

                                <input type="radio" name="danxuan" title="{:L('OPTION',['format'=>'C'])}"/>

                            </div>

                        </div>

                        <div class="layui-form-item">

                            <label class="layui-form-label pl0">{:L('CHECKBOX')}</label>

                            <div class="layui-input-block ml0">

                                <input type="checkbox" name="danxuan" title="{:L('OPTION',['format'=>'A'])}" lay-skin="primary" />

                                <input type="checkbox" name="danxuan" title="{:L('OPTION',['format'=>'B'])}" lay-skin="primary" />

                                <input type="checkbox" name="danxuan" title="{:L('OPTION',['format'=>'C'])}" lay-skin="primary" />

                            </div>

                        </div>

                    </div>

                </div>

            </div>

            <div class="intro-item">

                <div class="intro-title">{:L('FORM_OPTION_NOTE')} <i class="iconfont icon-xiangxiajiantou fr"></i></div>

                <div class="intro-detail hidden">

                    <p>1. {:L('FORM_OPTION_NOTE5',['a'=>l('RADIO'),'b'=>l('CHECKBOX'),'c'=>l('SELECT'),'d'=>l('SELECT_TEXT')])}</p>

                    <p>2. {:L('FORM_OPTION_NOTE2')}</p>

                    <p>3. {:L('FORM_OPTION_NOTE3')}</p>

                    <p>4. {:L('FORM_OPTION_NOTE4')}</p>

                </div>

            </div>

            <div class="intro-item">

                <div class="intro-title">{:L('FIELD_NAME_NOTE')} <i class="iconfont icon-xiangxiajiantou fr"></i></div>

                <div class="intro-detail hidden">

                    <p>1. {:L('FIELD_NAME_NOTE1')}</p>

                    <p>2. {:L('FIELD_NAME_NOTE2')}</p>

                    <p>3. {:L('FIELD_NAME_NOTE3')}</p>

                    <p>4. {:L('FIELD_NAME_NOTE4')}</p>

                    <p>5. {:L('FIELD_NAME_NOTE5')}</p>

                </div>

            </div>

            <div class="intro-item">

                <div class="intro-title">{:L('FORM_NAME_NOTE')} <i class="iconfont icon-xiangxiajiantou fr"></i></div>

                <div class="intro-detail hidden">

                    <p>1. {:L('FORM_NAME_NOTE1')}</p>

                    <p>2. {:L('FORM_NAME_NOTE2')}</p>

                    <p>3. {:L('FORM_NAME_NOTE3')}</p>

                </div>

            </div>

            <div class="intro-item">

                <div class="intro-title">{:L('FORM_DESCRIPTION_NOTE')} <i class="iconfont icon-xiangxiajiantou fr"></i></div>

                <div class="intro-detail hidden">

                    <p>{:L('FORM_DESCRIPTION_NOTE1')}</p>

                </div>

            </div>

            <div class="intro-item">

                <div class="intro-title">{:L('REQUIRED_ENABLE_NOTE')} <i class="iconfont icon-xiangxiajiantou fr"></i></div>

                <div class="intro-detail hidden">

                    <p>1. {:L('REQUIRED_ENABLE_NOTE1')}</p>

                    <p>2. {:L('REQUIRED_ENABLE_NOTE2')}</p>

                </div>

            </div>

            <div class="intro-item">

                <div class="intro-title">{:L('FORM_SORT_NOTE')} <i class="iconfont icon-xiangxiajiantou fr"></i></div>

                <div class="intro-detail hidden">

                    <p>1. {:L('FORM_SORT_NOTE1')} </p>

                </div>

            </div>

        </div>

        <include file="Public:section" />

    </div>

    <include file="Public:language" />

    <script type="text/javascript">

        $(function()
        {
            $(".form-tab").on('click',function()
            {
                if(!$(this).hasClass('active'))
                {
                    $(this).addClass('active');

                    $('.form-content').removeClass('hidden');

                    $(".intro-tab,.form-intro").addClass('hidden').removeClass('active');
                }
            });

            $(".intro-tab").on('click',function()
            {
                if(!$(this).hasClass('active'))
                {
                    $(this).addClass('active');

                    $('.form-intro').removeClass('hidden');

                    $('.form-tab,.form-content').addClass('hidden').removeClass('active');
                }
            });

            $(".intro-title").on('click',function()
            {
                $(this).next('.intro-detail').slideToggle().parent('.intro-item').toggleClass('active');

                if($(this).find('i').hasClass('icon-xiangxiajiantou'))
                {
                    $(this).find('i').removeClass('icon-xiangxiajiantou').addClass('icon-upward');
                }
                else
                {
                    $(this).find('i').removeClass('icon-upward').addClass('icon-xiangxiajiantou');
                }
            });
        })

    </script>

</block>
